<template>
  <!-- 工时统计查看详情 -->
  <div>
    <!-- :dataSource="dataSource" -->
    <FilterTable
      ref="table"
      columnsRef="repair_queryStatistics_hoursStatistics_queryDetail_main"
      height="auto"
      maxHeight="350"
      :columns="columns"
      :params="fetchParams"
      :dataSource="tableDataList"
      :datakey="'rows'"
      :isSelectColumn="false"
      :isMemoryPagination="true"
      :onColumnsChange="columns => (this.columns = columns)"
      :onSyncTableData="handleTableDataChange"
      :isExportExcel="isExportExcel"
      exportFileName="工时统计明细导出.xlsx"
    >
    </FilterTable>
    <div class="bottomBtnWrap">
      <el-button @click="hanldeClose">关闭</el-button>
    </div>
  </div>
</template>

<script>
import { queryHoursStatisticsDetail } from '@/api/repair/queryStatistics/hoursStatistics';
import { getDealerUser } from '@/api/part/partInventory/partInventory/index.js';
import { dictionary } from '@/utils/dictMixin';

export default {
  mixins: [dictionary],
  props: ['fetchParams', 'isExportExcel'],
  data() {
    return {
      columns: this.createTableColumns(),
      fetchApi: queryHoursStatisticsDetail,
      tableDataList: [], // table列表数据
      dataSource: []
    };
  },
  mounted() {
    this.getUserList();
    this.queryMainTableData();
  },
  methods: {
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'cIndex',
          labelWidth: 70,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        },
        { title: '委托书', dataIndex: 'RO_NO', sorter: true, filter: true, filterType: 'input' },
        { title: '车系', dataIndex: 'SERIES_NAME', sorter: true, filter: true, filterType: 'input', showOverflowTooltip: true },
        { title: '车型代码', dataIndex: 'MODEL_CODE', sorter: true, filter: true, filterType: 'input' },
        { title: '车型名称', dataIndex: 'MODEL_NAME', sorter: true, filter: true, filterType: 'input', showOverflowTooltip: true },
        { title: '班组代码', dataIndex: 'WORKGROUP_CODE', sorter: true, filter: true, filterType: 'input' },
        { title: '班组名称', dataIndex: 'WORKGROUP_NAME', sorter: true, filter: true, filterType: 'input' },
        { title: '主修人代码', dataIndex: 'TECHNICIAN', sorter: true, filter: true, filterType: 'input' },
        { title: '主修人名称', dataIndex: 'TECHNI_NAME', sorter: true, filter: true, filterType: 'checkbox', dictItems: [] },
        { title: '项目代码', dataIndex: 'LABOUR_CODE', sorter: true, filter: true, filterType: 'input', showOverflowTooltip: true },
        { title: '项目名称', dataIndex: 'LABOUR_NAME', sorter: true, filter: true, filterType: 'input', showOverflowTooltip: true },
        { title: '工时', dataIndex: 'STD_LABOUR_HOUR', sorter: true, filter: true, filterType: 'number', summation: true, precision: 2 },
        { title: '工时费', dataIndex: 'LABOUR_AMOUNT', sorter: true, filter: true, filterType: 'number', summation: true, precision: 2 },
        { title: '优惠后工时费 ', dataIndex: 'REAL_AMOUNT', sorter: true, filter: true, filterType: 'number', summation: true, precision: 2 },
        { title: '派工时间', dataIndex: 'ASSIGN_TIME', sorter: true, filter: true, filterType: 'date-range', showOverflowTooltip: true, exportFormat: { t: 'd' } },
        { title: '工单状态', dataIndex: 'RO_STATUS', sorter: true, filter: true, filterType: 'checkbox', filterItems: this.createDictList('8049'), dictItems: this.createDictList('8049') },
        {
          title: '是否结清',
          dataIndex: 'PAY_OFF',
          sorter: true,
          filter: true,
          filterType: 'radio',
          filterItems: this.createDictList('1004'),
          dictItems: this.createDictList('1004')
        },
        { title: '牌照号', dataIndex: 'LICENSE', sorter: true, filter: true, filterType: 'input' },
        { title: '完工日期', dataIndex: 'COMPLETE_TIME', sorter: true, filter: true, filterType: 'date-range', showOverflowTooltip: true, exportFormat: { t: 'd' } },
        { title: '结算日期', dataIndex: 'BALANCE_TIME', sorter: true, filter: true, filterType: 'date-range', showOverflowTooltip: true, exportFormat: { t: 'd' } }
      ];
    },
    // 点击关闭按钮
    hanldeClose() {
      this.$emit('close');
    },
    // 查询table主数据
    async queryMainTableData() {
      // let formParams = await this.$refs.topFilter.GET_FORM_DATA();
      this.$refs.table.START_LOADING();
      try {
        let res = await this.fetchApi(this.fetchParams);
        if (res.resultCode == 200) {
          this.tableDataList = res.data;
        }
      } catch (err) {
        console.log(err, '查询table主数据失败');
      } finally {
        this.$refs.table.STOP_LOADING();
      }
    },
    // 查询所有用户
    async getUserList() {
      let res = await getDealerUser();
      if (res.resultCode == 200) {
        this.columns.find(item => item.dataIndex == 'TECHNI_NAME').dictItems = res.data.map(item => ({ text: item.employeeName, value: item.userId + '' }));
        this.columns.find(item => item.dataIndex == 'TECHNI_NAME').filterItems = res.data.map(item => ({ text: item.employeeName, value: item.userId + '' }));
      }
    },
    handleTableDataChange(list) {
      list.map(item => {
        item.TECHNI_NAME = item.TECHNICIAN;
      });
    }
  }
};
</script>

<style scoped>
.bottomBtnWrap {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  border-top: 1px solid rgb(233, 233, 233);
  padding: 10px 20px;
  background: rgb(255, 255, 255);
  text-align: right;
}
</style>
